<!DOCTYPE html>
<html lang="en">

<head>
  <!-- 
    meta主要是设置网页的一些数据，元数据不给用户看

    charset 指定网页的字符集
    name 指定的数据的名称
    content 指定的数据的内容

    keywords 网页关键字
    description 网页的描述

   -->
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="keywords" content="html,css,前端">
  <meta name="description" content="网页描述">
  <!-- 重定向 -->
  <meta http-equiv="refresh" content="3;url=https://www.baidu.com">
  <title>Document</title>
</head>

<body> 

</body>

</html>

<!-- 
  meta定义文档元信息

<meta>` 元素是HTML中用于定义文档元信息（metadata）的标签。元信息是关于文档的数据，通常不直接显示在页面上，而是提供有关文档的信息给浏览器、搜索引擎和其他 Web 服务。

以下是一些常用的 `
<meta>` 元素及其作用：

1. **字符集设置：**
- 用于指定文档的字符集。例如，`
<meta charset="UTF-8">` 表示文档使用 UTF-8 字符集。这是确保文档正确解析和显示各种字符的重要设置。

```html
<meta charset="UTF-8">
```

2. **视口设置：**
- 用于控制移动设备上浏览器的视口（viewport），以确保网页在不同设备上以最佳方式显示。这对于响应式设计非常重要。

```html
<meta name="viewport" content="width=device-width, initial-scale=1.0">
```

- 上述例子中，`width=device-width` 表示视口宽度等于设备的宽度，`initial-scale=1.0` 表示初始缩放比例为1.0。

3. **描述和关键词：**
- 用于提供有关文档内容的描述和关键词，有助于搜索引擎更好地理解和索引页面。

```html
<meta name="description" content="网页描述">
<meta name="keywords" content="关键词1, 关键词2, 关键词3">
```

4. **作者和版权：**
- 提供有关文档作者和版权的信息。

```html
<meta name="author" content="作者名">
<meta name="copyright" content="版权信息">
```

5. **刷新和重定向：**
- 用于指定文档的刷新间隔或自动重定向。

```html
<meta http-equiv="refresh" content="5;url=http://example.com">
```

- 上述例子表示在加载页面后等待5秒，然后重定向到指定的URL。

`
<meta>` 元素是一种非常强大的工具，能够提供关键的信息，确保文档在各种环境中正确显示和被理解。在实际开发中，根据具体需求选择合适的 `
<meta>` 设置是很重要的一步。
 -->